<html xmlns="http://www.w3.org/1999/xhtml">
  <head>
    <meta http-equiv="Content-Type" content="text/html" ; charset="utf-8" />
    <title>宏宇教育信息采集</title>
    <link href="./index.css" rel="stylesheet" type="text/css" />
  </head>

  <style>
    .hide .el-upload--picture-card {
      display: none;
    }
    .box-card {
      margin: 20px 0;
    }
  </style>

  <body>
    <div id="app">
      <app-refund-base-information
        type="look"
        ref="baseInfo"
      ></app-refund-base-information>
      <app-education
        type="look"
        :level-list="levelList"
        v-if="isEducation"
        ref="education"
      ></app-education>
      <app-occupation
        type="look"
        v-if="isOccupation"
        ref="occupation"
      ></app-occupation>
      <app-title type="look" v-if="isTitle" ref="title"></app-title>
      <app-train type="look" v-if="isTrain" ref="train"></app-train>
      <app-cost-information-fenqi
        :type="type"
        :fee-len="feeLen"
        ref="costInfo"
        :title="costTitle"
      ></app-cost-information-fenqi>
      <!-- <app-refund-info ref="refundInfo"></app-refund-info> -->
      <app-resolve-info v-if="denyReason" ref="resolveInfo"></app-resolve-info>
      <el-row>
        <el-col style="display: flex; justify-content: center">
          <el-button
            v-if="type !== 'look'"
            :disabled="isSubmit"
            type="primary"
            @click="handleValid('submit')"
            >提交</el-button
          >
          <el-button v-else @click="handleBack" type="primary">返回</el-button>
        </el-col>
      </el-row>
    </div>

    <script src="../../../js/jquery.js"></script>
    <script src="../../../js/common.js"></script>
    <script src="../../../js/vue.js"></script>
    <script src="../../../js/element.js"></script>
    <script src="./components/RefundBaseInfo.js"></script>
    <script src="./components/EducationLevel.js"></script>
    <script src="./components/Certificate.js"></script>
    <script src="./components/Education.js"></script>
    <script src="./components/Occupation.js"></script>
    <script src="./components/Title.js"></script>
    <script src="./components/Train.js"></script>
    <script src="./components/CostInformationFenqi.js"></script>
    <script src="./components/ResolveInfo.js"></script>
    <!-- <script src="./components/RefundInfo.js"></script> -->

    <script>
      const app = new Vue({
        el: "#app",
        created() {
          this.infoName = getQuery("trainType");
        },
        mounted() {
          this.getPageTitle();
          this.getEducationOption();
          this.pageNumber = Number(getQuery("pageNumber"));
          // 如果是通过操作进入当前页面，就调用获取的接口

          (this.type = getQuery("type")) && this.getStudentInfo();
        },
        data: {
          // 点击返回把当前查询页面页码返回
          pageNumber: 0,
          oldData: {},
          isSubmit: false,
          levelList: [],
          // 当前页面的名称
          infoName: "",
          feeIds: [],
          id: "",
          genId: "",
          type: "",
          action: "",
          idNo: "",
          denyReason: "",
          refundData: null,
          feeLen: 1,
          studyId: "",
          baseInfoMap: new Map([
            ["name", "name"],
            ["phoneNum", "phone"],
            ["idNo", "idNum"],
            ["sex", "gender"],
          ]),
          educationMap: new Map([
            ["studyMode", "pathLabel"],
            ["educationName", "levelLabel"],
            ["schoolName", "schoolLabel"],
            ["majorName", "discipline"],
            ["batch", "batch"],
          ]),
          occupationKeys: [
            "professionalTypes",
            "majorName",
            "batch",
            "applyExplain",
          ],
          titleKeys: [
            "professionalLevel",
            "professionalSeries",
            "majorName",
            "batch",
          ],
          trainKeys: [
            "applyProject",
            "examCourse",
            "classs",
            "applyAssist",
            "startDate",
            "endDate",
            "batch",
          ],
          feesMap: new Map([
            ["stage", "stage"],
            ["amount", "fee"],
            ["term", "feeDate"],
            ["flag", "isFee"],
            ["receiptStatus", "receipt"],
            ["receiptNo", "receiptNum"],
          ]),
          feeMap: new Map([
            ["otherFee", "otherFee"],
            ["paidinFee", "training"],
            ["explains", "description"],
            ["allFee", "total"],
            ["preferentialFee", "discount"],
            ["realPayFee", "paid"],
          ]),
        },
        computed: {
          isEducation() {
            return this.infoName === "education";
          },
          isOccupation() {
            return this.infoName === "occupation";
          },
          isTitle() {
            return this.infoName === "title";
          },
          isTrain() {
            return this.infoName === "train";
          },
          costTitle() {
            const map = {
              education: "学历",
              occupation: "职业",
              title: "职称",
              train: "培训",
            };
            return map[this.infoName];
          },
        },
        methods: {
          handleBack() {
            window.location.href = `../hotel/paySearch.html?pageNumber=${this.pageNumber}`;
          },
          getPageTitle() {
            localStorage.setItem("name", "学生管理/分期缴费信息查询/分期缴费");
            // const type = getQuery('from');
            // switch (type) {
            //     case 'student':
            //         localStorage.setItem('name', '学生管理/学生信息查询/退款');
            //         break;
            //     case 'jiaowu':
            //         localStorage.setItem('name', '教务管理/教务信息管理/审核');
            //         break;
            //     case 'jiaofei':
            //         localStorage.setItem('name', '财务管理/缴费信息管理/审核')
            //         break;
            //     case 'fenqi':
            //         localStorage.setItem('name', '学生管理/分期缴费信息查询/分期缴费')
            //         break;
            // }
          },
          getRefs(key = "") {
            const {
              baseInfo = {},
              costInfo = {},
              // refundInfo = {},
              resolveInfo = {},
              education = {},
              occupation = {},
              title = {},
              train = {},
            } = this.$refs;

            return {
              baseInfo: baseInfo[key],
              costInfo: costInfo[key],
              // refundInfo: refundInfo[key],
              resolveInfo: resolveInfo[key],
              education: education[key],
              occupation: occupation[key],
              title: title[key],
              train: train[key],
            };
          },
          handleValid(flag) {
            this.action = flag;
            this.$refs.costInfo.$refs.form.validate((valid) => {
              if (valid) {
                this.submit();
              } else {
                this.$message({
                  message: "学历缴费信息未填写完成",
                  type: "error",
                });
              }
            });
          },
          submit() {
            const from = getQuery("from");
            const type = getQuery("type");
            // const { refundInfo } = this.getRefs("formData");
            const {
              student,
              fees,
              studentCards,
              studentEducation = null,
              studentOccupation = null,
              studentTitle = null,
              studentTrain = null,
            } = this.refundData;

            delete student.createDate;
            studentCards.map((item) => delete item.createDate);
            if (studentEducation) {
              delete studentEducation.createDate;
            } else if (studentOccupation) {
              delete studentOccupation.createDate;
            } else if (studentTitle) {
              delete studentTitle.createDate;
            } else {
              delete studentTrain.createDate;
            }

            $.ajax({
              url: baseUrl + "studentInfo/updateStudentInfo",
              method: "Post",
              contentType: "application/json;charset=UTF-8",
              data: JSON.stringify({
                ...this.refundData,
              }),
              headers: {
                Authorization: JSON.parse(localStorage.getItem("userInfo"))
                  .token,
              },
              success: (data) => {
                this.isSubmit = true;
                this.postFees(data);
              },
              error: (err, res, res1) => {
                this.$message({
                  message: err.responseJSON.message || "网络错误",
                  type: "error",
                });
              },
            });
          },
          postFees({ commitBoolean }) {
            const { costInfo } = this.getRefs("formData");

            const fees = costInfo.fees.map((item, index) => {
              // const { id, studentId, studyId, trainType, flag } = item;
              const data = {
                id: this.feeIds[index],
                studentId: item.studyId || this.id,
                studyId: item.studyId || this.genId,
                trainType: this.infoName,
                commitFlag: 1,
                businessProgress: 2,
                commitBoolean,
                teacherId: JSON.parse(
                  localStorage.getItem("userInfo")
                ).account.split("-")[1],
                // 期数
                stage: item.stage || "",
                // 缴费日期
                term: item.feeDate,
                // 缴费金额
                amount: item.fee == 0 ? 0 : item.fee || "",
                // 是否已缴费
                flag: item.isFee,
                // 收据状态
                receiptStatus: item.receipt,
                // 收据编号
                receiptNo: item.receiptNum,
                // 其他费用名称
                otherName: costInfo.otherName,
                // 报名费
                otherFee: costInfo.otherFee,
                // 培训费
                paidinFee: costInfo.training,
                // 说明
                explains: costInfo.description,
                // 总费用
                allFee: costInfo.total,
                // 优惠费用
                preferentialFee: costInfo.discount,
                // 实缴费用
                realPayFee: costInfo.paid,
              };
              if (this.oldData.fees[index]) {
                const { createDate, ...oldFee } = this.oldData.fees[index];
                return {
                  ...oldFee,
                  ...data,
                };
              } else {
                return data;
              }
            });

            $.ajax({
              url: baseUrl + "studentInfo/updateStudentFees",
              method: "post",
              headers: {
                Authorization: JSON.parse(localStorage.getItem("userInfo"))
                  .token,
              },
              contentType: "application/json",
              data: JSON.stringify(fees),
              success: (data) => {
                this.$message({
                  message: `${
                    this.action === "save" ? "保存成功" : "提交成功"
                  }`,
                  type: "success",
                });
                window.location.href = "../hotel/paySearch.html";
              },
            });
          },
          getStudentInfo() {
            const trainType = getQuery("trainType");
            const idNo = getQuery("idNo");
            const studyId = getQuery("studyId");

            const {
              baseInfo,
              costInfo,
              // refundInfo,
              // resolveInfo,
              education,
              occupation,
              title,
              train,
            } = this.getRefs("formData");

            $.ajax({
              url: baseUrl + "studentInfo/getStudentInfo",
              method: "get",
              headers: {
                Authorization: JSON.parse(localStorage.getItem("userInfo"))
                  .token,
              },
              data: {
                idNo,
                trainType,
                studyId,
              },
              success: (data) => {
                this.oldData = data;
                this.id = data.student.id;

                this.refundData = data;
                // 除了学历分期是4，其他分期都是2
                this.feeLen = 2;
                for (item of this.baseInfoMap) {
                  baseInfo[item[1]] = data.student[item[0]];
                }

                console.log(`education`, education);

                if (education) {
                  this.genId = data.studentEducation.id;

                  this.feeLen = 4;
                  for (item of this.educationMap) {
                    this.type === "edit" &&
                      (this.genId = data.studentEducation.id);
                    education[item[1]] = data.studentEducation[item[0]];
                  }
                }

                if (occupation) {
                  this.genId = data.studentOccupation.id;

                  for (item of this.occupationKeys) {
                    this.type === "edit" &&
                      (this.genId = data.studentOccupation.id);
                    occupation[item] = data.studentOccupation[item];
                  }
                }

                if (title) {
                  this.genId = data.studentTitle.id;

                  for (item of this.titleKeys) {
                    this.type === "edit" && (this.genId = data.studentTitle.id);
                    title[item] = data.studentTitle[item];
                  }
                }

                if (train) {
                  this.genId = data.studentTrain.id;

                  for (item of this.trainKeys) {
                    this.type === "edit" && (this.genId = data.studentTrain.id);
                    if (item === "examCourse") {
                      train[item] = data.studentTrain[item].split(",");
                    } else {
                      train[item] = data.studentTrain[item];
                    }
                  }
                }

                data.fees.map((feeItem, index) => {
                  this.feeIds[index] = feeItem.id;
                  this.denyReason = feeItem.denyReason;
                  costInfo.otherName = feeItem.otherName;
                  for (item of this.feeMap) {
                    costInfo[item[1]] = feeItem[item[0]];
                    // refundInfo.refundableFee = feeItem.refundableFee
                    // refundInfo.deductFee = feeItem.deductFee
                    // refundInfo.realRefundFee = feeItem.realRefundFee
                  }
                  for (feesItem of this.feesMap) {
                    this.type === "edit" &&
                      (costInfo.fees[index].id = feeItem.id);
                    if (["stage", "fee"].includes(feesItem[1])) {
                      costInfo.fees[index][feesItem[1]] =
                        feeItem[feesItem[0]] || undefined;
                    } else {
                      costInfo.fees[index][feesItem[1]] = feeItem[feesItem[0]];
                    }
                  }
                });
                this.$nextTick(() => {
                  if (this.denyReason) {
                    const { resolveInfo } = this.getRefs("formData");

                    resolveInfo.denyReason = this.denyReason;
                  }
                });
              },
            });
          },
          getEducationOption() {
            $.ajax({
              url: baseUrl + "education/queryEducationList",
              async: false,
              method: "Post",
              headers: {
                Authorization: JSON.parse(localStorage.getItem("userInfo"))
                  .token,
              },
              success: (data) => {
                this.levelList = data;
              },
            });
          },
        },
      });
    </script>
  </body>
</html>
